<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			div{
				background-color: #F17704;
				margin-bottom: 20px;
				padding: 40px;
				text-align: end;
				/* 背景不重复 */
				/* background-repeat: no-repeat; */
				/* 居中 */
				/* background-position: center; */
			}
			#div1{
				border-top-width: 20px;
				border-top-color: #000000;
				border-bottom-width: 5px;
				border-bottom-color: #057ED4;
				border-style: groove;
			}
			/* 改变placeholder中内容的颜色 */
			input::-webkit-input-placeholder { /* WebKit browsers 适配谷歌 */
			    color: #FF0000;
			}
			input:-moz-placeholder { /* Mozilla Firefox 4 to 18 适配火狐 */
			    color: #FF0000;
			}
			input::-moz-placeholder { /* Mozilla Firefox 19+ 适配火狐 */
			    color: #FF0000;
			}
			input:-ms-input-placeholder { /* Internet Explorer 10+  适配ie*/
			    color: #FF0000;
			}
		
		</style>
	</head>
	<body>
		补充：浏览内核
			firefox:moz
			chrome:webkit
			ie:ie内核
			
		div
		盒子的宽度
			padding + 内容
		padding：内边距，影响内容与边框线的距离
			-left：左
			-right：右
			-top：顶部
			-bottom：底部
			padding:40px;上下左右都是40px的内边距
		margin：外边距，影响盒子与另一个盒子的距离
		如何修改内容的高度？
			linr-height: 可以修改内容的高度
		<div id="div1" style="padding-left: 20px;font-size: 40px;">
			div的内容
		</div>
		<div style="padding-left: 20px;">
			div的内容
		</div>
		<p>底部文字</p>
		
		<input type="text" placeholder="提示内容" />
		<div style="width: 200px;height: 100px;">
			宽度200px，高度100px
		</div>
	</body>
</html>
